<template>
    <div class="add-address">
          <yx-header>
            <template #left>
                <van-icon name="arrow-left" @click="$router.go(-1)"/>
            </template>
            <template #center>
               新增地址
            </template>
            <template #right>
               
            </template>
        </yx-header>
        <!-- show-postal邮政编码 -->
        <van-address-edit
        :area-list="areaList"
        show-postal
        show-delete
        show-set-default
        show-search-result
        :search-result="searchResult"
        delete-button-text="取消"
        @save="onSave"
        @delete="$router.push('/addressList')"
       
        />

    </div>
</template>
<script>
import yxHeader from '@/components/yxHeader'
import {ref,reactive,toRefs,computed} from 'vue'
import {useStore} from 'vuex'

import { Notify,Toast } from 'vant';
import {useRouter} from 'vue-router'
// 引入省市区插件
import { areaList } from '@vant/area-data';
import {addAddressApi} from '@/utils/second'
export default {
    setup(props) {
        const searchResult=ref([
         {
            name: '黄龙万科中心',
            address: '杭州市西湖区',
          },
          {
            name: '新亚产业园',
            address: '河南省郑州市经开区',
          },
        ])
        const {push} = useRouter()
        // 点击保存时候触发  val回调参数   就是表单的内容 
        const onSave=(val)=>{
            console.log(val);
            // 组合一个对象
            let obj = {
                address:val.addressDetail,//详细地址
                cityId:val.areaCode.slice(0,4)+'00',//所属城市编码
                code:val.postalCode,//邮编
                linkMan:val.name,
                mobile:val.tel,
                isDefault:val.isDefault,
                provinceId:val.areaCode.slice(0,2)+'0000',//所属省份的编码
                token:localStorage.getItem('token')
                
            }
            addAddressApi(obj).then(res=>{
                console.log(res)
                if(res.code == 0){
                    push('/addressList')
                    Notify({message:'成功',type:'success'})

                }
            })


    
        }
        
        return {areaList,onSave,searchResult}
    },
    components:{
        yxHeader
    }
}
</script>
<style lang="scss" scoped>
:deep(.van-button--danger){
    background: green!important;
    border:none;
}
</style>
